import React, { useEffect, useState } from 'react';
import { Modal, Descriptions, message } from 'antd';

const MarginDetail: React.FC<any> = ({
    visible,
    cancel,
    projectInfo,
}) => {

    const [ detailInfo, setDetailInfo ] = useState<any>({});

    const getDetailInfo = async() => {
        let res = await getProductRecordDetail({
            id:projectInfo.id
        })
        if (res && res.success) {
            setDetailInfo(res.data)
        }else{
            message.error(res.errMsg)
        }
    }

    useEffect(()=>{
        getDetailInfo()
    },[])


    return (
        <>
            <Modal
                title='保证金缴纳详情'
                onCancel={cancel}
                visible={visible}
                width='700px'
            >
                <Descriptions title={detailInfo.projectName} column={2}>
                    <Descriptions.Item label="施工单位">{detailInfo.corpName}</Descriptions.Item>
                    <Descriptions.Item label="申请人">{detailInfo.userName}</Descriptions.Item>
                    <Descriptions.Item label="施工单位编号">{detailInfo.corpCode}</Descriptions.Item>
                    <Descriptions.Item label="申请人身份证">{detailInfo.idCardNo}</Descriptions.Item>
                    <Descriptions.Item label="企业营业执照" contentStyle={{overflow:'hidden'}} span={2}><span className={styles.imgBox} ><img src={detailInfo.businessLicenseUrl} /></span></Descriptions.Item>
                    <Descriptions.Item label="缴纳金额" span={2}>empty</Descriptions.Item>
                    <Descriptions.Item label="银行审核状态" span={2}>empty</Descriptions.Item>
                </Descriptions>
            </Modal>
        </>
    )
}

export default MarginDetail;